<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="./web/js/rem.js"></script>
    <link rel="stylesheet" href="./web/css/public.css">
    <link rel="stylesheet" href="./web/css/register.css">

    <script src="./web/js/jquery.js"></script>
    <link rel="stylesheet" href="./web/css/bui.css">
    <script src="./web/js/bui.js"></script>
    <title>注册</title>
    <style>
    .user-login .user-name span{
        width: 2rem;
    }
    </style>
</head>

<body>
    <div class="user-login">
        <div class="user-name">
            <span>手机号</span>
            <input type="text" placeholder="请输入手机号" maxlength="11" id="phone">
        </div>
    </div>
    <div class="user-login">
        <div class="user-name">
            <span>验证码</span>
            <input type="text" style="width: 2.5rem;" placeholder="请输入验证码" id="code">
        </div>
        <button class="getcode" id="changetext">获取验证码</button>
    </div>
    <div class="user-login">
        <div class="user-name">
            <span>新密码</span>
            <input type="password" placeholder="请输入密码" id="pwd">
        </div>
    </div>
    <div class="user-login">
        <div class="user-name">
            <span>确认新密码</span>
            <input type="password" placeholder="请再次输入密码" id="pwdangin">
        </div>
    </div>
    <div class="btn">
        <button class="submit" onclick="submit()">注册</button>
    </div>
    <script>


        // 判断是否为手机号
        function isPoneAvailable(pone) {
            var myreg = /^[1][0-9][0-9]{9}$/;
            if (!myreg.test(pone)) {
                    bui.alert("手机号有误");
                return false;
            }
            else if (pone == '' || pone.length <= 10) {
                    bui.alert("手机号有误");
                return false;
            }
        }
        $('#changetext').click(function () {
            if (isPoneAvailable($('#phone').val()) == false) {
                return
            } else {
                $.ajax({
                    url: 'https://api.it120.cc/zhuyuan98/verification/sms/get?mobile=' + $('#phone').val(),
                    success(res) {
                        console.log(res)
                        var count = 60;
                        $('#changetext').text('倒计时' + count + 's');
                        var timer = null;
                        timer = setInterval(function () {
                            if (count > 0) {
                                count = count - 1;
                                $('#changetext').text('倒计时' + count + 's');
                                $('#changetext').attr('disabled', "true");
                            }
                            else {
                                clearInterval(timer);
                                $('#changetext').text('获取验证码');
                                $('#changetext').removeAttr("disabled");
                            }
                        }, 1000);
                        if(res.code == 0){
                            bui.alert("发送成功");
                        }else{
                            bui.alert(res.msg);
                    }
                    }
                })
            }
        })
        function submit() {
            if ($('#phone').val().length == 0 || $('#code').val().length == 0 || $('#pwd').val().length == 0 || $('#pwdangin').val().length == 0) {
     
                    bui.alert("请填写完整信息");
              
                return
            }
            else if($('#pwd').val() !== $('#pwdangin').val()){
              
                    bui.alert("密码不一致");
           
                return
            }
            else{
                $.ajax({
                    url:'https://api.it120.cc/zhuyuan98/verification/sms/check',
                    data:{
                        code:$('#code').val(),
                        mobile:$('#phone').val()
                    },
                    success(res){
                        console.log(res)
                        if(res.code == 0){
                    
                            bui.alert("注册成功");
                   
                        }else{
             
                            bui.alert(res.msg);
                   
                        }

                        
                    }
                })
            }
        }
    </script>
</body>

</html>